<!--
Google IO 2012/2013 HTML5 Slide Template

Authors: Eric Bidelman <ebidel@gmail.com>
         Luke Mahé <lukem@google.com>

URL: https://code.google.com/p/io-2012-slides
-->
<!DOCTYPE html>
<html>
<head>
  <title>BLOGOES TO SCHOOL - LOENPIA.NET</title>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="chrome=1">
  <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">-->
  <!--<meta name="viewport" content="width=device-width, initial-scale=1.0">-->
  <!--This one seems to work all the time, but really small on ipad-->
  <!--<meta name="viewport" content="initial-scale=0.4">-->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <link rel="stylesheet" media="all" href="theme/css/default.css">
  <link rel="stylesheet" href="theme/css/colorbox.css">
  <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="theme/css/phone.css">
  <link href='http://fonts.googleapis.com/css?family=Amatic+SC|Handlee' rel='stylesheet' type='text/css'>
  <base target="_blank"> <!-- This amazingness opens all links in a new tab. -->
  <script data-main="js/slides" src="js/require-1.0.8.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  <script src="js/jquery.colorbox.js"></script>
		<script>
			$(document).ready(function(){
				//Examples of how to assign the Colorbox event to elements
				$(".muncul").colorbox({rel:'muncul'});
				$(".callbacks").colorbox({
					onOpen:function(){ alert('onOpen: colorbox is about to open'); },
					onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
					onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
					onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
					onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
				});
				//Example of preserving a JavaScript event for inline calls.
				$("#click").click(function(){ 
					$('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
					return false;
				});
			});
		</script>
</head>
<body style="opacity: 0">

<slides class="layout-widescreen">

  <slide class="logoslide nobackground" style="background-image: url(images/ppntulis.jpg)">
     <article class="flexbox vcenter">
      <span><img src="images/blogoesmini.png"></span>
    </article>
  </slide>

  <slide class="title-slide segue nobackground fill" style="background-image: url(images/ppntulis.jpg)">
    <aside class="gdbar"><img src="images/logoloenpia.png"></aside>
    <!-- The content of this hgroup is replaced programmatically through the slide_config.json. -->
    <hgroup class="auto-fadein">
      <h1  class="white" data-config-title><!-- populated from slide_config.json --></h1>
      <h2 data-config-subtitle><!-- populated from slide_config.json --></h2>
      <p data-config-presenter><!-- populated from slide_config.json --></p>
    </hgroup>
  </slide>

  <slide>
    <hgroup>
      <h2>Manfaat Ngeblog</h2>
    </hgroup>
    <article>
      <ul>
        <li>Sharring</li>
        <li>Belajar Menulis</li>
		<li>Branding</li>
        <li>Dokumentasi</li>
		<li>Dapat Teman</li>
        <li>Dapat Penghasilan</li>
      </ul>
    </article>
  </slide>

  <slide>
    <hgroup>
      <h2>Membuat Blog WordPress.com</h2>
    </hgroup>
    <article>
      <ul class="build fade">
        <li>Masuk ke WordPress.com Klik <span class="get"><a class="muncul" href="../content/get.jpg" title=""> Get Started</a></span></li>
        <li>Isi formnya → <span class="creat"><a class="muncul" href="../content/step1.jpg" title=""> Create Blog</a></span></li>
        <li>STEP 1 <span class="creat"><a class="muncul" href="../content/step2.jpg" title="">Next Step →</a></span></li>
		<li>STEP 2 <span class="creat"><a class="muncul" href="../content/step3.jpg" title="">Next Step →</a></span></li>
		<li>STEP 3 <span class="creat"><a class="muncul" href="../content/step4.jpg" title="">Next Step →</a></span></li>
		<li>STEP 4 <span class="creat"><a class="muncul" href="../content/step5.jpg" title="">Next Step →</a></span></li>
        <li>STEP 5 <span class="creat"><a href="/svn/trunk/Blogoes/finis/Blogoes-Loenpia.html#5" title="">Next Step →</a></span></li>
      </ul>
    </article>
  </slide>
  <slide>
    <hgroup>
      <h2>Next Step → Membuat Posting Pertama Kali</h2>
    </hgroup>
    <article>
      <ul class="build fade">
        <li>Membuat Posting dan Memberikan Tag dan Kategori<span class="liat"><a class="muncul" href="../content/step6.jpg" title=""> lihat gambar</a></span></li>
        <li>Upload gambar klik Insert Photo <span class="liat"><a class="muncul" href="../content/step7.jpg" title="">lihat gambar</a></span></li>
        <li>Mengatur ukuran gambar <span class="liat"><a class="muncul" href="../content/step8.jpg" title="">lihat gambar</a></span></li>
		<li>Membuat Link <span class="liat"><a class="muncul" href="../content/step9.jpg" title="">lihat gambar</a></span></li>
		<a class="muncul" href="../content/step10.jpg" title=""></a>
      </ul>
    </article>
  </slide>
  <slide hidden>
    Hidden slides are left out of the presentation.
  </slide>

  <slide>
    <hgroup>
      <h2>Confirm Email</h2>
    </hgroup>
    <article class="flexbox">
      <img src="../content/confirm.jpg" alt="Description" title="Description">
    </article>
  </slide>

    <slide>
    <hgroup>
      <h2>Confirm Email</h2>
    </hgroup>
    <article class="flexbox">
	  <img src="../content/email.jpg" alt="Description" title="Description">
    </article>
  </slide>
  
    <slide>
    <hgroup>
      <h2>Confirm Email</h2>
    </hgroup>
    <article class="flexbox">
	  <img src="../content/sukses.jpg" alt="Description" title="Description">
    </article>
  </slide>

  <slide>
    <article>
      <iframe data-src="http://diksain.wordpress.com/"></iframe>
    </article>
  </slide>

  <slide class="thank-you-slide segue nobackground" style="background-image: url(images/ppntulis.jpg)">
    <aside class="gdbar right"><img src="images/logoloenpia.png"></aside>
    <article class="flexbox vleft auto-fadein">
      <h2>&lt; Thank You! &gt;</h2><br/>
	  <p>URL : http://goo.gl/V3Dc3q</p>
	</article>
  </slide>

  <slide class="logoslide nobackground" style="background-image: url(images/ppntulis.jpg)">
    <article class="flexbox vcenter">
      <span><img src="images/logoloenpia.png"></span>
    </article>
  </slide>

  <slide class="backdrop"></slide>

</slides>

<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXXXXX-1']);
_gaq.push(['_trackPageview']);

(function() {
  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>

<!--[if IE]>
  <script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>
  <script>CFInstall.check({mode: 'overlay'});</script>
<![endif]-->
</body>
</html>
